<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>Swiper - Most Modern Mobile Touch Slider</title>
    <link rel="stylesheet" href="./css/normalize.css">
    <link rel="stylesheet" href="./css/swiper.min.css">
    <link rel="stylesheet" href="./css/main.css">
</head>

<body>
    
    <header>
        <div class="header-swipers">
            <div class="swiper-container header-swiper-back-2">
                <div class="swiper-wrapper">
                    <div class="swiper-slide"></div>
                    <div class="swiper-slide"></div>
                    <div class="swiper-slide"></div>
                    <div class="swiper-slide"></div>
                </div>
            </div>
            <div class="swiper-container header-swiper-back-1">
                <div class="swiper-wrapper">
                    <div class="swiper-slide"></div>
                    <div class="swiper-slide"></div>
                    <div class="swiper-slide"></div>
                    <div class="swiper-slide"></div>
                </div>
            </div>
            <div class="swiper-container header-swiper-front">
                <div class="swiper-pagination swiper-pagination-white"></div>
                <div class="swiper-button-next swiper-button-white"></div>
                <div class="swiper-button-prev swiper-button-white"></div>
                <div class="swiper-wrapper">
                    <div class="swiper-slide">
                        <div class="logo"></div>
                        <div class="titles">
                            <h1 class="title">Swiper</h1>
                            <h2 class="subtitle">Most Modern Mobile Touch Slider</h2>
                            <div class="by"><a href="//idangero.us">by iDangero.us</a></div>
                            <div class="clearfix"></div>
                        </div>
                        <div class="release-info">MIT Licensed, v4.5.0 released on February 22, 2019 |<a href="https://github.com/nolimits4web/swiper/blob/master/CHANGELOG.md"
                                target="_blank">Changelog</a></div>
                        <div class="links"><a href="https://github.com/nolimits4web/swiper/releases">Download</a><a
                                href="./get-started/">Get Started</a><a href="./api/">API</a><a href="./demos/">Demos</a><a
                                href="./forum/">Forum</a></div>
                        <div class="github-buttons">
                            <iframe class="github-btn" src="//ghbtns.com/github-btn.html?user=nolimits4web&repo=swiper&type=watch&count=true"
                                width="100" height="20"></iframe>
                            <iframe class="github-btn" src="//ghbtns.com/github-btn.html?user=nolimits4web&repo=swiper&type=fork&count=true"
                                width="100" height="20"></iframe>
                        </div>
                    </div>
                    <div class="swiper-slide">
                        <div class="slide-title">Top Notch Features</div>
                        <ul class="slide-features-list">
                            <li>Library Agnostic</li>
                            <li>Mutation Observer</li>
                            <li>Flexbox Layout</li>
                            <li>Full True RTL Support</li>
                            <li>Multi Row Slides Layout</li>
                            <li>3D Effects</li>
                            <li>Two-way Control</li>
                            <li>Full Navigation Control</li>
                            <li>Rich API</li>
                            <li>Most Flexible Slides Layout Grid</li>
                            <li>Parallax Transitions</li>
                            <li>Images Lazy Loading</li>
                            <li>Virtual Slides</li>
                            <li>And many more ...</li>
                        </ul>
                    </div>
                    <div class="swiper-slide swiper-slide-gallery">
                        <div class="swiper-container swiper-gallery-top">
                            <div class="slide-title demo-iframe-title">Build Complex Touch Galleries</div>
                            <div class="swiper-wrapper">
                                <div data-background="http://lorempixel.com/1200/600/nature/1" class="swiper-slide swiper-lazy">
                                    <div class="swiper-lazy-preloader swiper-lazy-preloader-white"></div>
                                </div>
                                <div data-background="http://lorempixel.com/1200/600/nature/2" class="swiper-slide swiper-lazy">
                                    <div class="swiper-lazy-preloader swiper-lazy-preloader-white"></div>
                                </div>
                                <div data-background="http://lorempixel.com/1200/600/nature/3" class="swiper-slide swiper-lazy">
                                    <div class="swiper-lazy-preloader swiper-lazy-preloader-white"></div>
                                </div>
                                <div data-background="http://lorempixel.com/1200/600/nature/4" class="swiper-slide swiper-lazy">
                                    <div class="swiper-lazy-preloader swiper-lazy-preloader-white"></div>
                                </div>
                                <div data-background="http://lorempixel.com/1200/600/nature/5" class="swiper-slide swiper-lazy">
                                    <div class="swiper-lazy-preloader swiper-lazy-preloader-white"></div>
                                </div>
                            </div>
                        </div>
                        <div class="swiper-container swiper-gallery-thumbs">
                            <div class="swiper-wrapper">
                                <div style="background-image:url(http://lorempixel.com/300/200/nature/1)" class="swiper-slide"></div>
                                <div style="background-image:url(http://lorempixel.com/300/200/nature/2)" class="swiper-slide"></div>
                                <div style="background-image:url(http://lorempixel.com/300/200/nature/3)" class="swiper-slide"></div>
                                <div style="background-image:url(http://lorempixel.com/300/200/nature/4)" class="swiper-slide"></div>
                                <div style="background-image:url(http://lorempixel.com/300/200/nature/5)" class="swiper-slide"></div>
                            </div>
                        </div>
                    </div>
                    <div class="swiper-slide last-centered-slide">
                        <div class="slide-title">Start Using It Now</div>
                        <div class="slide-subtitle">Swiper is completely free and open-source</div>
                    </div>
                </div>
            </div>
        </div>
    </header>
    
   
    <script src="../thumbGallery/static/js/jquery-1.7.2.min.js"></script>
    <script src="../thumbGallery/static/js/swiper.min.js"></script>
    
</body>

</html>